 <template>
  <el-form ref="form" :model="form" label-width="0">
    <!--rules推荐写在html结构-->
    <el-form-item>
      <span style="color:#ccc;">最多可以上传5张图</span>
      <e-img-group-upload v-model="form.value" :limit="5" />
    </el-form-item>
    <el-form-item>
      <el-input type="textarea" v-model="form.name" :maxlength="200" number-word placeholder="添加描述" :rows="5" style="width:98%;"></el-input>
    </el-form-item>
    <!--loading是必需在绑定的 native-type="submit"修改button type类型-->
    <div class="button-box">
      <el-button @click="handleReset">取 消</el-button>
      <el-button type="primary" :loading="loading" :disabled="form.value.length == 0 && form.name == ''" @click="handleAddImgCard">确 定</el-button>
    </div>
  </el-form>
</template>
<script>
import {form} from 'utils/mixins' // 引入form mixin
import EImgGroupUpload from '@e-ui/ImgGroupUpload'
export default {
  mixins: [form],
  props: {
    imgCardList: {
      type: Object,
      default: {
        value: [],
        name: ''
      }
    }
  },
  components: {
    EImgGroupUpload
  },
  data () {
    return {
      loading: false, // 必需要返回loading
      form: {
        value: this.imgCardList.value,
        name: this.imgCardList.name
      }
    }
  },
  methods: {
    handleAddImgCard () { // 提交后台数据
      this.$emit('addImgcard', this.form)
    },
    handleReset () {
      this.form.value = []
      this.form.name = ''
      this.$emit('closeDialog')
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
 